<template>
  <tm-navbar :leftWidth="650" title="">
    <template v-slot:left>
      <view class="flex flex-bread">
        <view class="flex" v-for="(item, index) in props.dataList" :key="index">
          <tm-text
            _class="text-overflow-1 text-weight-b"
            :color="index === props.dataList.length - 1 ? '#366ef4' : ''"
            @click="goBackUrl(index)"
          >
            {{ item.name }}</tm-text
          >
          <tm-text
            _class="text-overflow-1 text-weight-b mglr5"
            parentClass="mglr5"
            v-if="index < props.dataList.length - 1"
          >
            >
          </tm-text>
        </view>
      </view>
    </template>
  </tm-navbar>
</template>

<script lang="ts" setup>
import { computed } from 'vue'
type Props = {
  dataList: any[]
}
const props = defineProps<Props>()
function goBackUrl(index: number) {
  const arrLength = computed(() => {
    return props.dataList.length
  })
  const backnum: any = arrLength.value - index - 1
  uni.navigateBack({
    delta: backnum
  })
}
</script>

<style lang="scss" scoped>
/* 仅在支付宝小程序编译 */
/*  #ifdef  MP-ALIPAY  */
.flex-bread {
  margin-left: 70rpx;
}
/*  #endif  */
</style>
